import { Component, Injector, OnDestroy, OnInit } from '@angular/core';
import { NavigationEnd, Router } from '@angular/router';
import { Subject } from 'rxjs';
import { filter, takeUntil } from 'rxjs/operators';
import { listAnimation } from '../../../../animations/list.animation';
import { BaseUI } from '../../../../common/base';
import { UserService } from '../../user/service/user.service';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ValidatorService } from '../../../../common/validator.service';
import { ConfigModule } from '../../../../config.module';
import { NzUploadFile } from 'ng-zorro-antd/upload';
import { environment } from '../../../../../environments/environment';
import { ActionService } from '../../../../services/action.service';

@Component({
    selector: 'app-role',
    templateUrl: './index.component.html',
    styleUrls: ['./index.component.scss'],
    animations: [listAnimation]
})
export class UserCenterComponent extends BaseUI implements OnInit, OnDestroy {
    onDestroy$: Subject<any> = new Subject<any>();
    entity:any;
    dataForm: FormGroup;
    pwdDataForm: FormGroup;
    saveLoadingState: boolean = false;
    pwdEntity={
        oldPassword: {
            value:'',
            visible: false
        },
        newPassword: {
            value:'',
            visible: false
        },
        confirmPassword: {
            value:'',
            visible: false
        }
    }
    loadingState = true;
    avatar: NzUploadFile = null;
    baseUrl: string = environment.baseUrl;

    constructor(
        public _config: ConfigModule,
        private _router: Router,
        private _injector: Injector,
        public userService: UserService,
        private _formBuilder: FormBuilder,
        private _validatorService: ValidatorService,
        private actionService: ActionService
    ) {
        super(_injector);
        // 表单验证
        this.dataForm = this._formBuilder.group({
            nickName: ['', [Validators.required]],
            phonenumber: ['',[Validators.required]],
            email: ['',[Validators.required]],
        });

        this.pwdDataForm = this._formBuilder.group({
            oldPassword: ['', [Validators.required]],
            newPassword: ['',[Validators.required]],
            confirmPassword: ['',[Validators.required,_validatorService.validateEqual("newPassword")]],
        });

        this._router.events
            .pipe(
                filter((ev) => ev instanceof NavigationEnd),
                takeUntil(this.onDestroy$)
            )
            .subscribe(() => {
            });
    }

    ngOnInit() {
        this.getProfile();
    }


    ngOnDestroy() {
    }

    getProfile(){
        this.loadingState = true;
        this.userService.getProfile().subscribe(res => {
            if (res.success){
                this.entity = res.data;
                this.entity.postGroup = res.postGroup;
                this.entity.roleGroup = res.roleGroup;
                this.avatar = {url: this.baseUrl+this.entity.avatar ||"https://vue.ruoyi.vip/static/img/profile.473f5971.jpg"} as NzUploadFile;
            }
        }).add(()=>{
            this.loadingState = false;
        })
    }

    onSave() {
        const data = {
            email: this.entity.email,
            nickName: this.entity.nickName,
            phonenumber: this.entity.phonenumber,
            sex: this.entity.sex
        }
        this.userService.saveProfile(data).subscribe(res => {
            if (res.success){
                this.messageService.success('保存成功');
            }
        })
    }

    onPwdSave() {
        const data = {
            oldPassword: this.entity.email,
            newPassword: this.entity.nickName,
        }
        this.userService.updatePwd(data).subscribe(res => {
            if (res.success){
                this.messageService.success('修改密码成功');
            }
        })
    }

    revertValue(caseNumber: string) {
        switch (caseNumber){
            case "1":
                this.pwdEntity.oldPassword.visible = !this.pwdEntity.oldPassword.visible;
                return;
            case "2":
                this.pwdEntity.newPassword.visible = !this.pwdEntity.newPassword.visible;
                return;
            case "3":
                this.pwdEntity.confirmPassword.visible = !this.pwdEntity.confirmPassword.visible;
                return;
        }
    }

    onAvatarChange($event: any) {
        this.actionService.changeAvatar();
    }
}
